<!doctype html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <title>用户列表</title>
    <meta charset="UTF-8">

    <script src="../../../js/jquery-2.0.3.min.js"></script>
    <link rel="stylesheet" href="../../../css/bootstrap.min.css">
    <script src="../../../js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../../../css/bootstrapValidator.css">
    <script src="../../../js/bootstrapValidator.js"></script>
    <script src="../../../js/jquery.cookie.js"></script>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="../../../js/hostConfig.js"></script>

</head>
<body>
<div class="container">
    <br>

    <div class="col-lg-1 "><a href="/#" class="btn btn-default">返回首页</a></div>
    <div class="col-lg-1"><a href="/pages/manage/user/add.html" class="btn btn-default">增加用户</a></div>
    <table class="table table-hover">
        <caption>文件列表</caption>
        <thead>
        <tr>
            <th>ID</th>
            <th>名称</th>
            <th>手机</th>
            <th>操作</th>
        </tr>
        </thead>

        <tbody id="app">
        <tr v-for="user in todos">
            <td v-text="user.id"></td>
            <td v-text="user.name">1</td>
            <td v-text="user.mobilephone">2</td>
            <td><a href="javascript:;" v-on:click="submitUserInfo(user.id)">删除</a> <a
                    :href="'/pages/manage/user/update.html?id='+user.id">修改</a></td>
        </tr>
        </tbody>
    </table>

</div>
</body>
</html>

<script>
    var path = host_tomcatR;
    var app = new Vue({
        el: '#app',
        data: {
            todos: [],
            ret: []
        },
        mounted() {
            axios({method: 'post', url: path + '/user/list', withCredentials: true}).then(res => this.todos = res.data);
        },
        methods: {
            submitUserInfo: function (id) {
                $.ajax({
                    type: "post",
                    url: path + "/user/delete",
                    xhrFields: {
                        withCredentials: true
                    },
                    crossDomain: true,
                    data: {id: id},
                    success: function (data) {
                        if (data["code"] == "0000") {
                            window.location.href = "/pages/manage/user/list.html";
                        } else {
                            console.log(this.ret);
//                        console.log(this.ret.code);
                        }
                    },
                    error: function (xhr, type) {
                        console.log(xhr);
                    }
                });


//                axios.post({url:path + '/user/delete?id=' + id,  withCredentials: true}).then(response => {
//                    this.ret = response.data;
//                    if (this.ret.code != "0000") {
//                        console.log(this.ret);
//                        console.log(this.ret.code);
//                    } else {
//                        window.location.href = "/pages/manage/user/list.html";
//                    }
//                });
            }
        }
    });

    //    var mydata;
    //    axios.get('/auth/user/list')
    //        .then(function (response) {
    ////            console.log(response);
    ////            console.log(response.data);
    //            console.log(response.data[0].id);
    //            mydata = response.data;
    //            console.log("data:");
    //            console.log(mydata);
    //
    //        })
    //        .catch(function (error) {
    //            console.log(error);
    //        });


    //    console.log(mydata);


    //
    //                        function (response) {
    ////            console.log(response);
    ////            console.log(response.data);
    //                        console.log(response.data[0].id);
    //                        mydata = response.data;
    //                        console.log("data:");
    //                        console.log(mydata);
    //
    //                    })
    //                    .catch(function (error) {
    //                        console.log(error);
    //                    });
    //            }
    //        }


</script>
